// LESS测试文件

// 变量定义
@primary-color: #007bff;
@secondary-color: #6c757d;
@spacing: 10px;
@font-size-base: 16px;

// 错误：变量名不符合命名规范（不是kebab-case）
@invalidVarName: 20px;

// 嵌套规则
.less-container {
  max-width: 1200px;
  padding: @spacing;

  &__header {
    font-size: @font-size-base * 1.5;
    color: @primary-color;

    // 过深嵌套（可能触发max-nesting-depth）
    & > .title {
      font-weight: bold;

      &-text {
        text-decoration: underline;

        &:hover {
          color: darken(@primary-color, 10%);
        }
      }
    }
  }

  // 空块（可能触发block-no-empty）
  &__empty {
  }
}

// mixin定义
.button-style(@bg-color, @text-color) {
  background-color: @bg-color;
  color: @text-color;
  padding: @spacing;
  border-radius: 4px;
  border: none;
  cursor: pointer;

  &:hover {
    background-color: darken(@bg-color, 10%);
  }
}

// mixin使用
.btn {
  .button-style(@primary-color, white);

  // 错误：使用无效的颜色函数
  &--secondary {
    .button-style(lighten(@secondary-color, 5%), black);
  }

  // 错误：冗余选择器
  & {
    display: inline-block;
  }
}

// 错误：选择器类型限定符
button.btn {
  font-weight: bold;
}

// 媒体查询
@media (max-width: 768px) {
  .less-container {
    padding: @spacing / 2;
  }
}

// 错误：无用的嵌套
.card {
  & .card-body {
    padding: @spacing;
  }
}

// 错误：重复变量
@spacing: 15px;

// LESS特有：命名空间
#my-namespace() {
  .button() {
    border: 1px solid #ccc;
  }
}

.custom-button {
  #my-namespace.button();
}

// LESS特有：变量插值
@prefix: my;
.@{prefix}-class {
  color: @primary-color;
}
